<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
    	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>扫描发货</title>
	    <link rel="stylesheet" href="css/AllStyle.css" />
	    <link rel="stylesheet" href="css/iconfont.css" />
	    <script type="text/javascript" src="js/common.js" ></script>
	    <script type="text/javascript" src="js/data.js" ></script>
	    <script type="text/javascript" src="js/tmpl.js" ></script><br />
	    <script type="text/javascript" src="js/echarts/common.js" ></script>
	</head>
	<body>
		<!-- 页头 -->
	    <section>
		    <script type="text/javascript">
		        AllPageHeader()
		    </script>
	    </section>
	    
	    <!-- 页面  -->
	    <section class="AllContent">
	    	<div class="ScanBlock" style="padding-bottom: 60px;">
	    		<form>
	    			<div style="display: none;">
                        <div class="form-group">
                            <label class="col-xs-3 control-label">产品</label>
                            <div class="col-xs-9">
                                <span id="pid"></span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-xs-3 control-label">发货网点</label>
                            <div class="col-xs-9">
                                <span id="from_branch"></span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-xs-3 control-label">收货网点</label>
                            <div class="col-xs-9">
                                <span id="to_branch"></span>
                            </div>
                        </div>
	    			</div>
	    			
	    			<div class="ScanInput">
	    				<p><input name="scanlist" id="scanlist" class="form-control"
                                           onkeypress="if (event.keyCode == 13) {
                                                           proccessTextArea();
                                                           return false;
                                                       }"
                                           placeholder="标签编号" ></p>
	    				<p><button type="button" onclick="updateDataToServer();">提交</button></p>
	    			</div>
	    			<p class="TheResults"><img width="100px" src="images/loading5.gif"></p>
	    		</form>
	    		<!-- 信息 -->
				<div class="dataNav">
					<ul>
						<li>标签编号</li>
						<li>操作</li>
					</ul>
				</div>
				
				<div id="itemList"></div>
	    		
	    	</div>
	    	
	    	<div class="size">当前扫描标签个数：<i> 0 </i>个</div>
	    </section>
	    
	</body>
	<script type="text/javascript" src="js/jquery.min.js" ></script>
	<script type="text/javascript" src="js/mui.min.js" ></script>
	<script type="text/javascript">
	    mui.init();
	    
	    $(function(){
	    	$("#scanlist").focus();
	    })
	    
		$('.AllHeader li:eq(1)').text('选择发货')
		$('.AllHeader li:eq(2)').html('<img style="width:28px" src="images/Scan.png">')
		
	    //扫描器
		document.getElementById('Scanner').addEventListener('tap', function() {
		  mui.openWindow({
		    url: 'Scanner.html?etk=101&index=scan2', 
		    id:'Scanner.html'
		  });
		});
		
		//添加refresh自定义事件监听
		window.addEventListener('scan',function(){
			var id = event.detail.id;
			$('#scanlist').val(id);
			proccessTextArea();
		});
		
		var sh;
		var datalist = new Array();
		var pid = "";
		var company = "";
		$(document).ready(function () {
		    $("#totalCount").html(0);
		    $("#listdata").html("");
		    pid = getCookie("scan.pid");
		    lot_no = getCookie("scan.lot_no");
		    from_bid = getCookie("scan.from_bid");
		    from_name = getCookie("scan.from_name");
		    to_bid = getCookie("scan.to_bid");
		    to_name = getCookie("scan.to_name");
        	is_del = getCookie("scan.is_del");
		    $("#pid").text(getCookie("scan.pname"));
		    $("#from_branch").text(getCookie("scan.from_name"));
		    $("#to_branch").text(getCookie("scan.to_name"));
		    //$("#pid").text(getCookie("scan.pid"));
		
		    getItemTrackingList();
		
		});
		
		function TRsetTimeout(){
			$('#scanlist').focus(function(){
				$('.TheResults').hide().html('<img width="100px" src="images/loading5.gif">');
			})
		}
		
		function proccessTextArea(){
            var item_no = getItemNo($("#scanlist").val());
            //$("#packageNo").val(itemNo);
            addItem(item_no);
            
            var _size = $('#itemList ul').size();
            $('.size').find('i').text(_size);
		}
		
		function clkAddItem() {
            var item_no =getItemNo($("#scanlist").val());
            addItem(item_no);
        }
        function addItem(item_no) {
            var isExit = false;
            $("#itemList ul").each(function() {
                var tmpItemNo = $(this).children("li").get(0).innerHTML;
                if (tmpItemNo === item_no) {
                    alert("标签已经存在：[" + item_no + "]");
                    isExit = true;
                }
            });

            if (isExit === false) {
                getPackageItem(item_no);
            }
            $("#scanlist").val("");
            $("#scanlist").focus();
        }
		function getPackageItem(item_no) {
            var ul = "<ul><li>" + item_no + "</li><li onClick='rmItem(this)'><a href='#'>删除</a></li></ul>";
            $("#itemList").append(ul);
            return true;
        }
			        
		function rmItem(k) {
            $(k).parent().remove();
            var _size = $('#itemList ul').size();
            $('.size').find('i').text(_size);
        }	        
			        
		function updateDataToServer() {
		    var item_no = "";
            $("#itemList ul").each(function() {
                var tmpItemNo = $(this).children("li").get(0).innerHTML;
                if (item_no === "") {
                    item_no = tmpItemNo;
                } else {
                    item_no = item_no + "," + tmpItemNo;
                }
            });
            
		    $(".TheResults").show()
		    var datas = {access_token:getToken(),item_no:item_no,pid:pid,from_branch:from_bid,to_branch:to_bid,lot_no:lot_no,is_del:is_del};
		    $.ajax({
		        type: "post",
		        url: getServerUrl() + "/Open/Comtag/delivery",
		        dataType: 'json',
		        data: datas,
		        success: function (json) {
		            if (json.result == "1") {
		                $(".TheResults").show(300).html("发送数据到平台成功！<br/>");
		                TRsetTimeout();
		                $('#itemList ul').html('');
		            } else {
		                $(".TheResults").show(300).html("上传出货数据到平台异常:[" + json.error_description + "]");
		                TRsetTimeout();
		                $('#itemList ul').html('');
		            }
		        }
		    });
		}
		
		function onsuccess() {
		    $("#homepagemessageid").html("上传出货数据到平台完成！");
		}
		
		function getItemTrackingList() {
		    $("#datalistid").html("");
		    $.ajax({
		        type: "get",
		        url: getServerUrl() + "/Open/ComSys/prosource?" + 'access_token='+getToken()+'&pid='+getCookie("scan.pid"),
		        dataType: 'json',
		        success: function (jdata) {
		                html = "";
		                for (var i = 0; i < jdata.length; i++) {
		                    html = html + '<li class="list-group-item">'
		                    + '<div class="media">'
		                    + '<div class="pull-right text-success m-t-sm">'
		                   // + '<button class="btn btn-warning btn-sm" onclick="deleteItemTracking(' + jdata[i].id + ');"><i class="fa fa-times"></i>删除</button>'
		                    + '</div>'
		                    + '<div class="media-body">'
		                    + '<div><a href="#">' + jdata[i].start_date + '</a></div>'
		                    + '<small class="text-muted">' + jdata[0].fname + ' &nbsp;&nbsp;&nbsp;&nbsp;</small>'
		                    + '<small class="text-muted"><i class="fa fa-forward"></i><i class="fa fa-forward"></i></small>'
		                    + '<small class="text-muted"> &nbsp;&nbsp;&nbsp;&nbsp;' + jdata[i].tname + ' &nbsp;&nbsp;&nbsp;&nbsp;</small>'
		                        // +'<small class="text-muted">'+jdata.data[i].type+'</small>'
		                    + '</div>'
		                    + '</div>'
		                    + '</li>';
		                }
		                html = html + '<li class="list-group-item">'
		                + '<div class="media">'
		                + '<div class="media-body">'
		                + '<div><a href="#">' + getYYYYMMDDDate() + '</a></div>'
		                + '<small class="text-muted">' + from_name + ' &nbsp;&nbsp;&nbsp;&nbsp;</small>'
		                + '<small class="text-muted"><i class="fa fa-forward"></i><i class="fa fa-forward"></i></small>'
		                + '<small class="text-muted"> &nbsp;&nbsp;&nbsp;&nbsp;' + to_name + ' &nbsp;&nbsp;&nbsp;&nbsp;</small>'
		                    // +'<small class="text-muted">'+jdata.data[i].type+'</small>'
		                + '</div>'
		                + '</div>'
		                + '</li>';
		                html = html + '<li class="list-group-item">'
		                + '<button type="button" class="btn btn-primary" onclick="openUrl(\'addtracking.html\');"><i class="fa fa-plus"></i>添加溯源过程</button>'
		                + '</li>';
		                $("#datalistid").html(html);
		        },
		        error: function () {
		            //jsonp 方式此方法不被触发.原因可能是dataType如果指定为jsonp的话,就已经不是ajax事件了
		            //请求出错处理
		            //alert("请求出错(请检查相关度网络状况.)");
		        }
		    });
		}
	</script>
</html>
